const navigation_li = document.querySelectorAll(".box1>.navigation>li")
const div_ele = document.querySelectorAll(".box1>.navigation>li>div")
const int = document.querySelector(".banxin>.a1>.tui")
const gouNum = document.querySelector(".box>.gouwudai>span")
const gouwudai = document.querySelector(".box>.gouwudai")
const id = window.localStorage.getItem("id")
const number = window.localStorage.getItem("number")
// 购物袋数量
numBer()
function numBer() {
    let span_ele = gouNum.innerText
    gouNum.innerText = number
    // 点击购物袋跳转购物车
    gouwudai.addEventListener("click", function () {
        window.location.href = "../html/cart.html"
    })

}

// 退出登录
int.addEventListener("click", function () {
    if (!window.confirm("您确定要退出吗")) return
    window.location.href = "../html/login.html"
})
//选项卡
tab()
function tab() {
    for (let i = 0; i < navigation_li.length; i++) {
        navigation_li[i].addEventListener("mouseover", function () {
            for (let j = 0; j < navigation_li.length; j++) {

                navigation_li[j].classList.remove("active")
                div_ele[j].classList.remove("active")
            }

            navigation_li[i].classList.add("active")
            div_ele[i].classList.add("active")
        })
        navigation_li[i].addEventListener("mouseout", function () {
            for (let j = 0; j < navigation_li.length; j++) {

                navigation_li[j].classList.remove("active")
                div_ele[j].classList.remove("active")
            }
        })
    }
}
// 轮播图
lunbo()
function lunbo() {
    var mySwiper = new Swiper('.swiper-container', {
        // direction: 'vertical', // 垂直切换选项
        loop: true, // 循环模式选项
        autoplay: true,

        // 如果需要分页器
        pagination: {
            el: '.swiper-pagination',
        },

        // 如果需要前进后退按钮
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },

        // 如果需要滚动条
        // scrollbar: {
        //     el: '.swiper-scrollbar',
        // },
    })
}
// 吸顶菜单
const boxTop = document.querySelector(".box2")
const stairs = document.querySelector(".box11")
console.log(stairs);
scroll()
function scroll() {
    window.onscroll = function () {
        var heights = document.documentElement.scrollTop || document.body.scrollTop
        // console.log(heights);
        if (heights >= 300) {
            boxTop.classList.add("active")
            stairs.classList.add("active")
        } else {
            boxTop.classList.remove("active")
            stairs.classList.remove("active")
        }
    }
}
staIrs()
function staIrs() {
    window.addEventListener("scroll", function () {
        var stairs_height = document.documentElement.scrollTop || document.body.scrollTop
        // console.log(stairs_height);
        stairs.addEventListener("click", function (evt) {
            const e = evt || event
            const target = e.target || e.srcElement
            if(target.className==="top"){
              window.scrollTo({
                  top:0,
                  behavior:"smooth"
              })
            }
            if(target.className==="index"){
                window.scrollTo({
                    top:400,
                    behavior:"smooth"
                })
            }
            if(target.className==="list"){
                window.scrollTo({
                    top:1400,
                    behavior:"smooth"
                })
            }
        })

    })

}
// 划入划出
const imgs_li = document.querySelectorAll(".box4>ul>li")
const imgs_div = document.querySelectorAll(".box4>ul>li>div")
module()
function module() {
    for (let i = 0; i < imgs_li.length; i++) {
        imgs_li[i].addEventListener("mouseover", function () {
            for (let j = 0; j < imgs_li.length; j++) {
                imgs_div[i].classList.remove("active")
            }
            imgs_div[i].classList.add("active")
        })
        imgs_li[i].addEventListener("mouseout", function () {
            imgs_div[i].classList.remove("active")
        })
    }
}
// 跨域请求
// https://recommender.scarabresearch.com/merchants/18BC49C88D345FEB/
// ?pv=1631841966&xp=1&f=f%3APERSONAL_PC_HOME%2Cl%3A20%2Co%3A0&cp=1&vi=4C9E2BC375F17F42&p=996455%7C1624091985
const box_ele = document.querySelector(".box8")

let data_id = 0
let suo = []
// console.log(suo);
getGoodsList()
async function getGoodsList() {
    const res = await pAjax({
        url: "https://recommender.scarabresearch.com/merchants/18BC49C88D345FEB/",
        data: 'pv=2143954331&xp=1&f=f%3APERSONAL_PC_HOME%2Cl%3A20%2Co%3A0&cp=1&vi=4C9E2BC375F17F42',
        dataType: "json"
    });
    const a = res.products
    suo = a
    let str = ``
    // console.log(a);

    for (let key in a) {
        let values = a[key]

        str += `
            <div class="info_list" data-id= "${key}">
           <div class="a1"><img src="${values[10]}" alt=""></div> 
            <p>${values[11]}</p>
            <p>${values[1]}</p>
            <p>￥${values[6]}</p>
            </div>
          `
        data_id++

    }
    box_ele.innerHTML = str

}

// 点击商品跳转到当前页面
box_ele.addEventListener("click", function (evt) {

    const e = evt || event
    const target = e.target || e.srcElement
    // console.log(target);
    if (target.tagName === "DIV") {

        let id = target.dataset.id
        // let data =id
        // console.log(data);
        console.log(id);
        //  console.log(JSON.stringify(suo[id]));
        const s = window.localStorage.setItem(`data`, JSON.stringify(suo[id]))


        window.location.href = "../html/list.html"
    }
})
